<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Sql Data Script Generator</title>
    <link href="/static/common/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet">
    <link href="/static/common/css/jquery.snippet.min.css" rel="stylesheet">
    <link href="/static/common/css/common.css" rel="stylesheet">
    <script type="text/javascript" src="/static/common/js/jquery-1.6.2.min.js"></script>
    <script type="text/javascript" src="/static/common/js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript" src="/static/common/js/jquery.snippet.min.js"></script>
    <script type="text/javascript" src="/static/common/js/interface.js"></script>
    <link href="/static/themes/conjuction/style.css" rel="stylesheet" type="text/css" media="screen"/>
</head>
<body>
<div id="logo">
    <h1><a href="#">Sql Data Script Generator</a></h1>
</div>
<hr/>
<!-- end #logo -->
<div id="header">
    <div id="menu">
        <ul>
            <li><a href="#" class="first">Home</a></li>
            <li><a href="#">About</a></li>
        </ul>
    </div>
    <!-- end #menu -->
</div>
<!-- end #header -->
<!-- end #header-wrapper -->
<div id="page">
    <div id="content">
        <div class="post">
            <h2 class="title"><a href="#">Script settings </a></h2>

            <div class="entry">
                <div>
                    <form action="/" method="post">
                        <div><label for="tableName">Table name:</label><input type="text" id="tableName">
                            <label for="rowCount">Row count:</label><input type="text" id="rowCount" value="20">
                            <label for="columnCount">Column count:</label><input type="text" id="columnCount" value="5">
                            <button id="createColumns">Create</button>
                        </div>
                        <table id="colsDesc" cellspacing="0" class="invisible">
                            <thead>
                            <tr>
                                <td>Name</td>
                                <td>Type</td>
                                <td>Populator</td>
                                <td>Delete</td>
                            </tr>
                            </thead>
                            <tbody id="rows"></tbody>
                        </table>
                        <div>
                            <button id="addRow" class="invisible">Add Row</button>
                            <button id="generate" class="invisible">Generate</button>
                        </div>
                    </form>
                </div>
                <div id="bitPopulatorDialog"></div>
                <div id="intPopulatorDialog"></div>
                <div id="floatPopulatorDialog"></div>
                <div id="datetimePopulatorDialog"></div>
                <div id="varcharPopulatorDialog"></div>
                <div id="log"></div>
                <script type="text/javascript">
                    $('#bitPopulatorDialog').dialog({autoOpen:false});
                    $('#intPopulatorDialog').dialog({autoOpen:false});
                    $('#floatPopulatorDialog').dialog({autoOpen:false});
                    $('#datetimePopulatorDialog').dialog({autoOpen:false});
                    $('#varcharPopulatorDialog').dialog({autoOpen:false});
                </script>
            </div>
        </div>
    </div>
    <!-- end #content -->
    <div id="sidebar">
        <ul>
            <li>
                <h2>Hints</h2>

                <p>If you want to wrap your source items, then use {@ins} variable. For example '{@ins}'.</p>

                <p>Calculated field populator supports the following variables:</p>

                <p>{@row} - replace var with current row number</p>

                <p>{@now} - replace var with current date</p>

                <p>{@name} - replace var with current column name</p>

                <p>{@someColumnName} replace var with value got by 'someColumnName' and current row</p>
            </li>
        </ul>
    </div>
    <!-- end #sidebar -->
    <div style="clear: both;">&nbsp;</div>
</div>
<!-- end #page -->
<div id="footer">
    <p>Copyright (c) 2011 Alexander Litvinenko. All rights reserved. Design by <a
            href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
</div>
<!-- end #footer -->
</body>
</html>
